<template>
  <div class="page">
    <!-- 搜索区域 开始 -->
    <div class="el_card_box">
      <el-form
        :inline="true"
        size="small"
        :model="formInline"
        class="search_form"
      >
        <el-form-item label="过期时间：" v-if="id == 2 || id == 5">
          <!-- <el-button :type="formInline.overdueDays == item.id?'primary':'default'" size="mini" v-for="(item,index) in buttonList" :key="index" @click="btnEvent(item)">{{item.name}}</el-button> -->
          <el-tag
            class="el_tag"
            :effect="formInline.overdueDays == item.id ? 'dark' : 'light'"
            :type="formInline.overdueDays == item.id ? '' : 'info'"
            size="small"
            v-for="(item, index) in buttonList"
            :key="index"
            @click="btnEvent(item)"
            >{{ item.name }}</el-tag
          >
        </el-form-item>
        <el-form-item label="报名时间：">
          <el-date-picker
            v-model="formInline.orderTime"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="创建时间：">
          <el-date-picker
            v-model="formInline.createTime"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="跟进时间：">
          <el-date-picker
            v-model="formInline.followTime"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="城市：">
          <!-- <el-select v-model="formInline.city" filterable clearable>
            <el-option v-for="(item,index) in cityList" :key="index" :label="item.name" :value="item.code"></el-option>
          </el-select> -->
          <city-select v-model="formInline.cities"></city-select>
        </el-form-item>
        <!-- <el-form-item label="报名费：" v-if="id != 2 && id != 5">
          <el-select v-model="formInline.enrollFee" clearable>
            <el-option v-for="(item,index) in ENROLLFEELIST" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="客户需求：">
          <!-- <el-select v-model="formInline.enrollProject" filterable clearable>
            <el-option v-for="(item,index) in projectList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select> -->
          <project-select v-model="formInline.projects"></project-select>
        </el-form-item>
        <el-form-item label="客户标签：">
          <tag-select v-model="formInline.tags" filter></tag-select>
        </el-form-item>
        <el-form-item label="客户状态：">
          <el-select v-model="formInline.customerStatus" clearable>
            <el-option
              v-for="(item, index) in CUSTOMERSTATUS"
              :key="index"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="负责人：">
          <!-- <el-select v-model="formInline.principal" filterable clearable>
            <el-option v-for="(item,index) in userList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select> -->
          <user-select v-model="formInline.principals"></user-select>
        </el-form-item>
        <el-form-item label="客户来源：">
          <user-source v-model="formInline.clueSources"></user-source>
        </el-form-item>
        <el-form-item label="广告代号：">
          <!-- <el-select v-model="formInline.adSource" filterable clearable>
            <el-option v-for="(item,index) in adCodeList" :key="index" :label="item.name" :value="item.id"></el-option>
          </el-select> -->
          <adcode-select v-model="formInline.adSources"></adcode-select>
        </el-form-item>
        <el-form-item label="所属部门：">
          <depart-ment v-model="formInline.departmentId"></depart-ment>
        </el-form-item>

        <el-form-item label="关键词：">
          <el-input
            v-model="formInline.term"
            :placeholder="getPlaceholder()"
            @keyup.enter.native="getList(1)"
          ></el-input>
        </el-form-item>
      </el-form>
      <div class="search_btn_box">
        <el-button type="primary" size="small" @click="getList(1)"
          >筛选</el-button
        >
        <el-button type="default" size="small" @click="rest"
          >清空筛选</el-button
        >
      </div>
    </div>
    <!-- 搜索区域 end -->

    <!-- 表格 开始 -->
    <div class="table_box">
      <!-- 操作区域 开始 -->
      <div class="action_box">
        <el-button
          type="primary"
          v-if="id != 8 && id != 10"
          size="small"
          @click="openAddCustomerDialog('addDialog')"
          >新增客户</el-button
        >
        <auth-button
          type="primary"
          uid="1021101"
          size="small"
          @click.native="openDialog('showTaskDialog')"
          v-if="id == 10"
          >任务分配</auth-button
        >
        <template v-if="id == 0">
          <auth-button
            type="default"
            uid="1020101"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020103"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020102"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020108"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel(1,true)"
            >批量导出非脱敏记录</auth-button
          >
          <auth-button
            type="default"
            uid="1020104"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020106"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 1">
          <auth-button
            type="default"
            uid="1020201"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020203"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020202"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020204"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020206"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 2">
          <auth-button
            type="default"
            uid="1020301"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020303"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020302"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020304"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020306"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 3">
          <auth-button
            type="default"
            uid="1020401"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020402"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020403"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020404"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020406"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 4">
          <auth-button
            type="default"
            uid="1020501"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020503"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020502"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020504"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020506"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 5">
          <auth-button
            type="default"
            uid="1020601"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020603"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020602"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020604"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020606"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 6">
          <auth-button
            type="default"
            uid="1020701"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020702"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020703"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020704"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020705"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 7">
          <auth-button
            type="default"
            uid="1020801"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1020802"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020803"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1020804"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1020805"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
        <template v-if="id == 8">
          <auth-button
            type="primary"
            uid="1020901"
            size="small"
            @click.native="claimCustomer"
            >认领客户</auth-button
          >
          <auth-button
            type="default"
            uid="1020903"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1020904"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
        </template>
        <template v-if="id == 9">
          <auth-button
            type="default"
            uid="1021001"
            size="small"
            @click.native="openDialog('importDialog')"
            >批量导入</auth-button
          >
          <auth-button
            type="default"
            uid="1021002"
            size="small"
            @click.native="batchUpdate"
            >批量修改</auth-button
          >
          <auth-button
            type="default"
            uid="1021003"
            size="small"
            :loading="eloading"
            @click.native="downloadExcel()"
            >批量导出</auth-button
          >
          <auth-button
            type="default"
            uid="1021004"
            size="small"
            @click.native="batchRemove"
            >批量删除</auth-button
          >
          <auth-button
            type="default"
            uid="1021005"
            size="small"
            @click.native="addPublic"
            >加入公海</auth-button
          >
        </template>
      </div>
      <!-- 操作区域 end -->

      <!-- <glsx-table :list="tableData" :column="columnList" selection :pageTotal="pageTotal" @change="getList">
        <div slot="operate" slot-scope="{scope}">
          <el-link type="primary" class="el_link" :underline="false" :id="scope.id">预约</el-link>
            <el-link type="primary" class="el_link" :underline="false">删除</el-link>
        </div>
      </glsx-table> -->

      <el-table
        ref="elTable"
        class="el_table"
        size="small"
        :data="tableData"
        @selection-change="onTableChange"
        @sort-change="sortChange"
        :row-class-name="showLineClassName"
      >
        <el-table-column
          type="selection"
          width="42"
          align="left"
          :show-overflow-tooltip="false"
        />
        <el-table-column prop="channelName" label="客户信息" width="150">
          <template slot-scope="{ row }">
            <tab-user :user="userFormatter(row)" v-if="row"></tab-user>
          </template>
        </el-table-column>
        <el-table-column prop="enrollProject" label="客户需求">
          <template slot-scope="{ row }">
            <div class="tag_list">
              <div
                class="tag"
                v-for="(item, index) in row.enrollProject
                  ? row.enrollProject.split(',')
                  : []"
                :key="index"
              >
                {{ item }}
              </div>
            </div>
          </template>
        </el-table-column>
        <template v-if="id != 10">
          <el-table-column
            prop="enrollTime"
            label="报名时间"
            sortable="custom"
            show-overflow-tooltip
            width="120"
          >
            <template slot-scope="{ row }">{{
              showTime(row.enrollTime)
            }}</template>
          </el-table-column>
        </template>
        <template v-if="id == 10">
          <el-table-column
            prop="assignTime"
            label="分配时间"
            sortable="custom"
            show-overflow-tooltip
            width="120"
          >
            <template slot-scope="{ row }">{{
              showTime(row.assignTime)
            }}</template>
          </el-table-column>
        </template>
        <!-- <el-table-column prop="age" label="年龄" width="80">
          <template slot-scope="{row}">{{row.age}}岁</template>
        </el-table-column>
        <el-table-column prop="enrollFee" label="报名费" width="80">
          <template slot-scope="{row}">{{row.enrollFee}}元</template>
        </el-table-column> -->
        <el-table-column prop="collectInfo" label="信息收集" width="200px">
          <template slot-scope="{ row }">
            <el-tooltip class="item" effect="dark" placement="top-start">
              <div slot="content" style="max-width: 240px">
                {{ row.collectInfo }}
              </div>
              <div class="tab_txt">{{ row.collectInfo }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column
          prop="followUpCnt"
          label="跟进次数"
          sortable="custom"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column
          prop="followUpContents"
          label="跟进记录"
          show-overflow-tooltip
          width="120"
        >
          <template slot-scope="{ row }">
            <el-popover placement="right" width="400" trigger="hover">
              <div class="show_follow_list">
                <p
                  class="show_p"
                  v-for="(item, index) in row.followUpContents"
                  :key="index"
                >
                  <span class="time">{{ item.issueTime }}</span>
                  <span class="txt">{{ item.issueContent }}</span>
                </p>
              </div>
              <div class="" slot="reference">
                <template v-for="(item, index) in row.followUpContents">
                  <p :key="index" class="show_p" v-if="index < 3">
                    {{
                      item.issueContent && item.issueContent.length > 6
                        ? item.issueContent.slice(0, 6) + "..."
                        : item.issueContent
                    }}
                  </p>
                </template>
              </div>
            </el-popover>
          </template>
        </el-table-column>

        <!-- 流失客户专用 开始 -->
        <template v-if="id == 6 || id == 7 || id == 8">
          <el-table-column
            prop="markRemark"
            :label="reasonLabel[id]"
            show-overflow-tooltip
            width="200px"
          >
          </el-table-column>
          <el-table-column prop="markTime" :label="timeLabel[id]" width="120">
            <template slot-scope="{ row }">{{
              showTime(row.markTime)
            }}</template>
          </el-table-column>
        </template>
        <!-- 流失客户专用 end -->

        <el-table-column
          prop="lastFollowupTime"
          label="跟进时间"
          sortable="custom"
          show-overflow-tooltip
          width="120"
          v-if="id != 6 && id != 7 && id != 8"
        >
          <template slot-scope="{ row }">{{
            showTime(row.lastFollowupTime)
          }}</template>
        </el-table-column>
        <el-table-column
          prop="principal"
          label="负责人"
          show-overflow-tooltip
          v-if="id != 8"
        />
        <el-table-column
          prop="overdueDate"
          label="到期时间"
          sortable="custom"
          show-overflow-tooltip
          v-if="id == 2 || id == 5"
        />
        <el-table-column
          prop="statusDesc"
          label="客户状态"
          show-overflow-tooltip
          v-if="id != 2 && id != 6 && id != 7 && id != 8 && id != 5"
        >
          <template slot-scope="{ row }">
            <div class="status_box">
              <span :class="classNameList[row.status]"></span>
              <span class="test">{{ row.statusDesc }}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="address"
          label="操作"
          width="120"
          align="center"
          v-if="id != 6 && id != 7"
        >
          <template slot-scope="{ row }">
            <el-link
              type="primary"
              class="el_link"
              v-if="id != 8 && row.markTag != 5"
              :underline="false"
              :id="row.id"
              @click="openDialog('bookDialog', row)"
              >预约</el-link
            >
            <!-- <el-link type="primary" class="el_link" :underline="false" @click="signleRemove(row)">删除</el-link> -->
            <auth-link
              type="primary"
              class="el_link"
              @click.native="signleRemove(row)"
              uid="1020105"
              >删除</auth-link
            >
            <auth-link
              type="primary"
              class="el_link"
              @click.native="signleReceive(row)"
              uid="1020902"
              >认领</auth-link
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination_list">
        <el-pagination
          background
          layout="sizes, total,prev, pager, next, jumper"
          :total="pageTotal"
          :page-size="pageSize"
          :page-sizes="pageSizes"
          :current-page.sync="pageNumber"
          @current-change="getList"
          @size-change="changePageSize"
        />
      </div>
    </div>
    <!-- 表格 end -->

    <!-- 批量导入 开始 -->
    <glsx-dialog
      :show="importDialog"
      title="批量导入"
      @close="closeDialog('importDialog')"
    >
      <div class="upload_box">
        <div class="cell" v-if="!isSuccess">
          <div class="name"><span class="cred">*</span>选择要导入的名单：</div>
          <div class="txt">
            <el-input
              v-model="uploadInfo.name"
              class="a_input"
              size="small"
              readonly
            ></el-input>
            <el-upload
              class="el_upload"
              ref="upload"
              :headers="uploadHeader"
              :accept="fileAccept"
              :action="IMPORTCUSTOMERINFO"
              :auto-upload="false"
              :show-file-list="false"
              :on-change="onFileChange"
              :on-success="onSuccess"
            >
              <el-button slot="trigger" size="small" type="primary"
                >选取文件</el-button
              >
              <el-button
                style="margin-left: 10px"
                size="small"
                type="success"
                @click="submitUpload"
                >上传</el-button
              >
            </el-upload>
          </div>
        </div>
        <div class="success_tips" v-if="isSuccess">
          <i class="el-icon-circle-check icon"></i>
          <span>成功导入</span>
          <span class="cred">{{ uploadSuccessInfo.succNum }}</span>
          <span>位客户，失败</span>
          <span class="cred">{{ uploadSuccessInfo.failNum }}</span>
          <span>位，</span>
          <a
            :href="BASEURL + uploadSuccessInfo.failFile"
            target="_blank"
            v-if="uploadSuccessInfo.failFile"
            >点击下载失败名单</a
          >
        </div>
      </div>
    </glsx-dialog>
    <!-- 批量导入 end -->

    <!-- 批量修改 开始 -->
    <glsx-dialog
      :show="editDialog"
      title="批量修改"
      @close="closeDialog('editDialog')"
    >
      <div>
        <edit-customer
          :ids="checkList"
          v-if="editDialog"
          @change="onChange"
        ></edit-customer>
      </div>
    </glsx-dialog>
    <!-- 批量修改 end -->

    <!-- 加入公海 开始 -->
    <glsx-dialog
      :show="publicDialog"
      title="加入公海"
      @close="closeDialog('publicDialog')"
    >
      <public-sea
        :ids="checkList"
        v-if="publicDialog"
        @change="onChange"
      ></public-sea>
    </glsx-dialog>
    <!-- 加入公海 end -->

    <!-- 任务分配 开始 -->
    <TaskAllocation v-model="showTaskDialog" @change="getList"></TaskAllocation>
  </div>
</template>

<script>
import {
  GETCUSTOMERSEARCH,
  BATCHCUSTOMEREXPORT,
  BATCHDELETECUSTOMER,
  IMPORTCUSTOMERINFO,
  BASEURL,
  BATCHMARKCUSTOMERINFO,
} from "@/http/customer";
import {
  GETCITYOPTIONS,
  GETPROJECTOPTIONS,
  GETUSEROPTIONS,
  GETADSOURCEOPTIONS,
} from "@/http/system";
import {
  showToast,
  showModal,
  deepClone,
  broadcast,
  received,
} from "@/common/util";
import { exportExcel } from "@/common/common";
import { ENROLLFEELIST, CUSTOMERSTATUS, GENDERLIST } from "@/common/constants";
import GlsxTable from "@/components/glsx-table/index";
import CustomerDetail from "./detail";
import AddCustomer from "./add";
import AddBook from "./addBook";
import EditCustomer from "./edit";
import TabUser from "@/components/user";
import PublicSea from "./sea";
import moment from "moment";
import TaskAllocation from "./taskAllocation.vue";
export default {
  name: "AllCustomer",
  props: {
    id: {
      type: [String, Number],
      default: 0,
    },
    size: {
      type: [String, Number],
      default: 20,
    },
    days: {
      type: Boolean,
      default: true,
    },
  },
  components: {
    GlsxTable,
    CustomerDetail,
    AddCustomer,
    AddBook,
    EditCustomer,
    TabUser,
    PublicSea,
    TaskAllocation,
  },
  data() {
    return {
      formInline: {},
      tableData: [],
      pageTotal: 0,
      pageNumber: 1,
      pageSizes: [10, 20, 50, 100],
      pageSize: 20,
      eloading: false,
      orderTime: [],
      showDialog: false,
      addDialog: false,
      loading: false,
      bookDialog: false,
      checkList: [],
      importDialog: false,
      uploadInfo: {},
      isSuccess: false,
      editDialog: false,
      customerId: "",
      cityList: [],
      ENROLLFEELIST: ENROLLFEELIST,
      CUSTOMERSTATUS: CUSTOMERSTATUS,
      projectList: [],
      userList: [],
      IMPORTCUSTOMERINFO: IMPORTCUSTOMERINFO,
      fileAccept: ".xlsx,.xls",
      uploadHeader: {},
      uploadSuccessInfo: {},
      BASEURL: BASEURL,
      GENDERLIST: GENDERLIST,
      classNameList: {
        1: "dot_red",
        2: "dot_orange",
        3: "dot_blue",
        4: "dot_green",
        5: "dot_grey",
        8: "dot_green",
        7: "dot_grey",
      },
      adCodeList: [],
      publicDialog: false,
      buttonList: [
        { name: "今天", id: "0" },
        { name: "明天", id: "1" },
        { name: "后天", id: "2" },
        { name: "大后天", id: "3" },
      ],
      reasonLabel: {
        6: "流失原因",
        7: "无效原因",
        8: "加入公海原因",
      },
      timeLabel: {
        6: "流失时间",
        7: "加入无效时间",
        8: "加入公海时间",
      },
      showTaskDialog: false,
    };
  },
  created() {
    console.log(this.days);
    if (!this.days) {
      this.formInline.overdueDays = 0;
    }
  },
  watch: {
    size: {
      handler: function (n, o) {
        this.pageSize = n;
      },
      immediate: true,
    },
  },
  mounted() {
    let _this = this;
    let token = sessionStorage.getItem("token");
    this.uploadHeader = { Authorization: token };

    if (this.id == 9) {
      this.pageSize = 50;
    }

    this.getList();
    //this.getCity();
    //this.getProject();
    //this.getUser();
    //this.getAdCodeList();
    received("customer.add.success", function () {
      _this.getList();
    });
  },
  methods: {
    /** 重置 */
    rest() {
      this.formInline = {};
      this.getList();
    },

    /** 每页展示 */
    changePageSize(e) {
      this.pageSize = e;
      this.getList();
    },

    /** 获取参数 */
    getParams() {
      let oParams = deepClone(this.formInline);
      let n = oParams.orderTime;
      let m = oParams.createTime;
      let b = oParams.followTime;

      if (n && n.length > 0) {
        oParams.enrollStartTime = n[0];
        oParams.enrollEndTime = n[1];
      }

      if (m && m.length > 0) {
        oParams.createdStartTime = m[0];
        oParams.createdEndTime = m[1];
      }

      if (oParams.enrollProject) {
        oParams.enrollProject = oParams.enrollProject.toString();
      }

      if (b && b.length > 0) {
        oParams.followupStartTime = b[0];
        oParams.followupEndTime = b[1];
      }

      delete oParams.orderTime;
      delete oParams.createTime;
      delete oParams.followTime;

      oParams.pageType = this.id;
      oParams.pageNumber = this.pageNumber;
      oParams.pageSize = this.pageSize;
      return oParams;
    },

    /** 获取列表 */
    getList(current) {
      let _this = this;
      this.pageNumber = current || this.pageNumber;
      let oParams = this.getParams();
      GETCUSTOMERSEARCH(oParams).then((res) => {
        let obj = res.data || {};
        _this.tableData = obj.list || [];
        _this.pageTotal = obj.totalElements;
      });
    },

    // 打开弹框
    openDialog(id, row) {
      this[id || "showDialog"] = true;
      if (row) {
        this.customerId = row.id;
      }
      if (id == "bookDialog") {
        broadcast("customer.add.book", { customerId: row.customerId });
      }
    },

    // 关闭弹框
    closeDialog(id) {
      // 导入弹框
      console.log(this.$refs);
      if (id == "importDialog") {
        //this.$refs.upload.clearFiles();
        this.uploadInfo = {};
        this.isSuccess = false;
      }

      this[id || "showDialog"] = false;
    },

    // 保存客户信息
    saveInfo() {
      this.loading = true;
      this.$refs.addCustomerCom.saveInfo();
    },

    // 监听新增客户组件变化
    onChange(e) {
      this.loading = false;
      if (e) {
        this[e.id || "addDialog"] = false;
        this.getList();
      }
    },

    // 监听表格勾选
    onTableChange(selection) {
      console.log(selection);
      this.checkList = selection;
    },

    // 批量删除
    batchRemove() {
      let _this = this;
      let list = this.checkList;

      if (!list || list.length <= 0) {
        showToast({
          message: "请选择要删除的客户",
        });
        return false;
      }

      showModal({
        message: "确认删除选择的客户吗？",
        showCancelButton: true,
        success: () => {
          let oParams = {};
          let arr = [];
          this.checkList.map((k) => arr.push(k.id));
          oParams.checkedIds = arr.toString();
          BATCHDELETECUSTOMER(oParams).then((res) => {
            if (res.code == 200) {
              showToast({
                message: "删除成功",
                type: "success",
              });
              _this.getList();
            }
          });
        },
      });
    },

    // 单个删除
    signleRemove(row) {
      let _this = this;
      showModal({
        message: "确认删除该客户吗？",
        showCancelButton: true,
        success: () => {
          let oParams = {};
          oParams.checkedIds = row.id;
          BATCHDELETECUSTOMER(oParams).then((res) => {
            if (res.code == 200) {
              showToast({
                message: "删除成功",
                type: "success",
              });
              _this.getList();
            }
          });
        },
      });
    },

    // 监听上传文件变化
    onFileChange(file) {
      console.log(file);
      this.uploadInfo = file;
    },

    // 文件上传
    submitUpload() {
      this.$refs.upload.submit();
    },

    // 监听文件导入成功
    onSuccess(response, file, fileList) {
      if (response.code == 200) {
        this.isSuccess = true;
        this.uploadSuccessInfo = response.data || {};
      }
    },

    // 批量修改
    batchUpdate() {
      let _this = this;
      let list = this.checkList;
      let oParams = deepClone(_this.formInline);
      if (!list || list.length <= 0) {
        showToast({
          message: "请选择要修改的客户",
        });
        return false;
      }

      let m = Object.keys(oParams);
      if (m.length > 0) {
        showModal({
          message: "确实是否修改筛选条件下面所有客户?",
          showCancelButton: true,
          type: "warning",
          success: function () {
            _this.openDialog("editDialog");
          },
        });
        return false;
      }
      _this.openDialog("editDialog");
    },

    // 格式化处理用户信息
    userFormatter(row) {
      let o = deepClone(row);
      o.customerName = o.name;
      o.customerPhone = o.phone;
      o.pageType = this.id;
      return o;
    },

    // 导出excel
    downloadExcel(id,needCheck) {
      let _this = this;
      let o = deepClone(_this.formInline);
      let m = Object.keys(o);
      console.log(m);
      if (m.length > 0) {
        showModal({
          message: "确定是否导出筛选条件下面所有客户列表?",
          showCancelButton: true,
          type: "warning",
          success: function () {
            _this.dowloadExcelFile(id,needCheck);
          },
        });
        return false;
      }
      showToast({
        message: "请选择筛选条件后再导出",
      });
      //_this.dowloadExcelFile(id,needCheck);
    },

    // 下载excel
    dowloadExcelFile(id, needCheck) {
      let _this = this;
      let oParams = _this.getParams();
      let options = {};
      let list = this.checkList;
      let arr = [];
      if (!needCheck) {
        if (!list || list.length <= 0) {
          showToast({
            message: "请选择要导出的客户",
          });
          return false;
        }

        list.map((k) => {
          arr.push(k.id);
        });

        oParams.checkedIds = arr.toString();
      }

      if (id) {
        oParams.desensitize = id;
      }

      delete oParams.pageNumber;
      delete oParams.pageSize;

      options.method = "POST";
      options.data = oParams;
      options.url = BATCHCUSTOMEREXPORT;
      options.fileName = "客户列表.xlsx";
      _this.eloading = true;
      exportExcel(options).then((res) => {
        _this.eloading = false;
      });
    },

    // 获取所有城市
    getCity() {
      GETCITYOPTIONS().then((res) => {
        this.cityList = res.data || [];
      });
    },

    // 获取所有项目
    getProject() {
      GETPROJECTOPTIONS().then((res) => {
        this.projectList = res.data || [];
      });
    },

    // 获取负责人列表
    getUser(name) {
      GETUSEROPTIONS({ username: name }).then((res) => {
        this.userList = res.data || [];
      });
    },

    // 打开新增客户
    openAddCustomerDialog() {
      broadcast("customer.add");
    },

    // 格式化展示时间
    showTime(str) {
      if (!str) {
        return "";
      }
      return moment(str).format("yyyy-MM-DD HH:mm");
    },

    // 获取广告代号
    getAdCodeList(id) {
      GETADSOURCEOPTIONS().then((res) => {
        this.adCodeList = res.data || [];
      });
    },

    // 时间排序
    sortMethod(a, b) {
      console.log(a);
      let a1 = a.lastFollowupTime ? moment(a.lastFollowupTime).format("x") : 0;
      let b1 = b.lastFollowupTime ? moment(b.lastFollowupTime).format("x") : 0;
      console.log(a1 - b1);
      return a1 - b1;
    },

    // 加入公海
    addPublic() {
      let _this = this;
      let list = this.checkList;
      let oParams = deepClone(_this.formInline);
      if (!list || list.length <= 0) {
        showToast({
          message: "请选择要加入公海的客户",
        });
        return false;
      }
      let m = Object.keys(oParams);
      if (m.length > 0) {
        showModal({
          message: "确实是否将筛选条件下面所有客户加入公海?",
          showCancelButton: true,
          type: "warning",
          success: function () {
            _this.openDialog("publicDialog");
          },
        });
        return false;
      }
      _this.openDialog("publicDialog");
    },

    // 时间筛选
    btnEvent(row) {
      this.$set(this.formInline, "overdueDays", row.id);
      this.getList();
    },

    // 认领客户
    claimCustomer() {
      let _this = this;
      let list = this.checkList;
      //let oParams = deepClone(_this.formInline);
      if (!list || list.length <= 0) {
        showToast({
          message: "请选择要认领的客户",
        });
        return false;
      }
      showModal({
        message: "确认领取勾选的客户吗？",
        showCancelButton: true,
        type: "warning",
        success: () => {
          let oParams = {};
          let arr = [];
          list.map((k) => {
            arr.push(k.id);
          });
          oParams.clueIds = arr;
          oParams.markTag = 6;
          BATCHMARKCUSTOMERINFO(oParams).then((res) => {
            if (res.code == 200) {
              showToast({
                message: "认领成功",
                type: "success",
              });
              _this.getList();
            }
          });
        },
      });
    },

    // 认领客户
    signleReceive(row) {
      let _this = this;
      showModal({
        message: "确认领取该客户吗？",
        showCancelButton: true,
        type: "warning",
        success: () => {
          let oParams = {};
          oParams.clueIds = [row.id];
          oParams.markTag = 6;
          BATCHMARKCUSTOMERINFO(oParams).then((res) => {
            if (res.code == 200) {
              showToast({
                message: "认领成功",
                type: "success",
              });
              _this.getList();
            }
          });
        },
      });
    },

    // 动态添加表格行class
    showLineClassName({ row, rowIndex }) {
      if (this.id != 2 && this.id != 5) {
        return "";
      }

      if (row.markTag != 2 && (row.overdueDays == 0 || row.overdueDays == 1)) {
        return "el_table_row_red";
      }

      return "";
    },

    // 动态展示
    getPlaceholder() {
      let id = this.id;
      let msg = "请输入客户姓名/电话";
      console.log(typeof id);
      switch (id) {
        case "7":
          msg += "/无效原因";
          break;
        case "6":
          msg += "/流失原因";
          break;
        case "8":
          msg += "/公海原因";
          break;
        default:
          msg = "请输入客户姓名/电话";
          break;
      }
      return msg;
    },

    // 监听表格排序
    sortChange({ column, prop, order }) {
      let o = { orderField: prop };
      this.formInline.orderField = prop;
      if (order == "ascending") {
        this.formInline.orderDirection = "ASC";
      } else {
        this.formInline.orderDirection = "DESC";
      }
      this.getList();
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/assets/style/customer/index.scss";
</style>
